<template>
    <view>
        <view class="banner_box" style="box-shadow: 2px 4px 8px 0px #f5f5f5">
            <swiper class="swiper_box margin-top-sm margin-lr-sm" duration="500" @change="currentHandle">
                <swiper-item v-for="(item, index) in banners" :key="index">
                    <image :src="item" :data-item="item" @tap.stop.prevent="previewImg" class="swiper_box"></image>
                </swiper-item>
            </swiper>
            <view class="banner_pageno radiues text-df padding-lr-sm text-center">{{ current + 1 }}/{{ banners.length }}</view>
        </view>
        <view
            @tap.stop.prevent="goEquity"
            class="tips_share text-center text-sm text-orange margin-lr-sm margin-bottom-sm"
            v-if="goodsDetail.productType == 1 || goodsDetail.productType == 3"
        >
            非凡创客分享被购买最高可获得¥{{ goodsDetail.shareTheBenefits || 0 }}收益，点击查看详情
        </view>
        <view class="bg-white margin-bottom-sm margin-lr-sm padding-lr-sm radius" style="box-shadow: 2px 4px 8px 0px #f5f5f5">
            <view class="flexs align-center justify-between padding-tb">
                <view class="text-xl text-bold" style="width: 550rpx">{{ goodsDetail.name }}</view>
                <button class="text-center" @tap="onShare">
                    <view class="flexs flex-direction">
                        <image :src="mallimgUrl + 'share.png'" class="goods_share"></image>
                        <view class="text-df text-bold">分享</view>
                    </view>
                </button>
            </view>
            <view class="flexs align-center justify-between padding-bottom-xs">
                <view class="flexs align-center">
                    <view class="text-price text-red text-lg text-bold">{{ goodsDetail.price }}</view>
                    <view class="text-red text-df text-bold padding-right-sm">
                        <block v-if="goodsDetail.integration && goodsDetail.price" class="text-red">+</block>
                        <text v-if="goodsDetail.integration">{{ goodsDetail.integration }}意豆</text>
                    </view>
                    <view class="text-price text-through text-df text-darkGray padding-left-sm" v-if="goodsDetail.originalPrice">{{ goodsDetail.originalPrice }}</view>
                    <view class="markerpic" v-if="goodsDetail.priceMaker" @tap.stop.prevent="getMarkerDetails">
                        <text class="text-orange">创客</text>
                        <text style="color: #ff1717">￥{{ goodsDetail.priceMaker }}</text>
                    </view>
                </view>
                <view class="text-darkGrey text-sm">已售：{{ goodsDetail.sale ? goodsDetail.sale : '0' }}{{ goodsDetail.unit || '' }}</view>
            </view>
            <view class="padding-bottom-sm text-sm text-orange" v-if="goodsDetail.distributionType != 1 && goodsDetail.distributionType">支持到店自提</view>
        </view>
        <view class="bg-white margin-bottom-sm margin-lr-sm padding-lr-sm radius padding-top-sm" style="box-shadow: 2px 4px 8px 0px #f5f5f5">
            <view class="flexs align-start padding-bottom-sm text-dm">
                <view class="text-darkGray" style="width: 80rpx">活动：</view>
                <view class="text-red flex-sub" v-if="goodsDetail.productType == 6">获得赠送10意豆、创客卡1张</view>
                <view class="text-red flex-sub" v-if="goodsDetail.productType == 2">购买大礼包获得赠送10意豆，获得价值100元美发现金抵用券</view>
                <view class="text-red flex-sub" v-if="goodsDetail.productType != 6 && goodsDetail.productType != 2">{{ goodsDetail.availableIntegrationRemark || '--' }}</view>
                <!-- 购买立享{{goodsDetail.giftPoint}}积分 -->
            </view>
            <view class="flexs align-start padding-bottom-sm text-dm">
                <view class="text-darkGray" style="width: 80rpx">快递：</view>
                <view class="text-darkGrey flex-sub">包邮</view>
            </view>
            <view class="flexs align-start padding-bottom-sm text-dm">
                <view class="text-darkGray" style="width: 80rpx">保障：</view>
                <view class="text-darkGrey flex-sub">正品保证、极速审核、24H极速发货</view>
            </view>
        </view>
        <view class="pick-store" v-if="stroeList[0]">
            <view class="centers more" @tap.stop.prevent="toMore">
                <view>查看更多</view>
                <image src="/static/images/righticon.png" class="icon-32"></image>
            </view>
            <view>自提门店：{{ stroeList[0].storename }}</view>
            <view>门店地址：{{ stroeList[0].storeLocationDto.cityName }}{{ stroeList[0].storeLocationDto.districtName }}{{ stroeList[0].storeLocationDto.location }}</view>
            <view>营业时间：{{ stroeList[0].starttime }}-{{ stroeList[0].endtime }}</view>
        </view>
        <view class="margin-bottom-sm margin-lr-lg">
            <view class="text-df text-bold padding-tb-sm">商品详情：</view>
            <!-- <image src="{{goodsDetail.pic}}" class="pic_img" mode="widthFix"></image> -->
            <rich-text :nodes="goodsDetail.detailMobileHtml" style="font-size: 0"></rich-text>
        </view>
        <view class="margin-bottom-sm margin-lr-lg">
            <view class="text-df text-bold padding-bottom-sm">价格说明：</view>
            <view class="padding-bottom-sm">
                <view class="text-dm text-darkGray">·意约价：</view>
                <view class="text-dm text-darkGrey">意约价为商品的销售价，是您最终决定是否购买商品的依据。</view>
            </view>
            <view class="padding-bottom-sm">
                <view class="text-dm text-darkGray">·划线价格：</view>
                <view class="text-dm text-darkGrey">
                    商品展示的划横线价格为参考价，并非原价，该价格可能是品牌专柜标价、商品吊牌价或由品牌供应商提供的正品零售价（如厂商指导价、建议零售价等）或该商品在意约平台上曾经展示过的销售价；由于地区、时间的差异性和市场行情波动，品牌专柜标价、商品吊牌价等可能会与您购物时展示的不一致，该价格仅供您参考。
                </view>
            </view>
            <view class="padding-bottom-sm">
                <view class="text-dm text-darkGray">·折扣：</view>
                <view class="text-dm text-darkGrey">
                    如无特殊说明，折扣指销售商在原价、或划线价（如品牌专柜标价、商品吊牌价、厂商指导价、厂商建议零售价）等某一价格基础上计算出的优惠比例或优惠金额；如有疑问，您可在购买前联系销售商进行咨询。
                </view>
            </view>
            <view class="padding-bottom-sm">
                <view class="text-dm text-darkGray">·异常问题：</view>
                <view class="text-dm text-darkGrey">
                    商品促销信息以商品详情页“促销”栏中的信息为准；商品的具体售价以订单结算页价格为准；如您发现活动商品售价或促销信息有异常，建议购买前先联系销售商咨询。
                </view>
            </view>
            <view class="padding-bottom-sm">
                <view class="text-dm text-darkGray">·价格说明：</view>
                <view class="text-dm text-darkGrey">意约价为商品的销售价，是您最终决定是否购买商品的依据。</view>
            </view>
        </view>
        <view v-if="randomGoodsList">
            <view class="flexs align-center justify-center">
                <view class="border_line bg-orange"></view>
                <view class="text-dg padding-lr">猜你喜欢</view>
                <view class="border_line bg-orange"></view>
            </view>
            <view class="flexs justify-between padding-lr-sm padding-bottom">
                <view>
                    <view
                        class="goods_info radius margin-top-sm bg-white"
                        v-if="index % 2 == 0"
                        :data-goodsid="item.id"
                        :data-productSn="item.productSn"
                        @tap.stop.prevent="gotoNext"
                        v-for="(item, index) in randomGoodsList"
                        :key="index"
                    >
                        <view class="p-r">
                            <image class="goods_img" mode="widthFix" :src="item.pic" />
                            <view class="goods_sold padding-lr-sm text-sm text-white" v-if="item.sale">已售: {{ item.sale }}</view>
                        </view>

                        <view class="padding-lr-sm margin-tb-sm text-df text-tline">{{ item.name || '' }}</view>

                        <view class="flexs align-center padding-lr-sm padding-bottom">
                            <view class="text-price text-red text-df text-bold">{{ item.price }}</view>
                            <view v-if="item.originalPrice != null" class="padding-left-sm text-price text-darkGray text-sm text-through">{{ item.originalPrice }}</view>
                        </view>

                        <view :class="item.marker ? 'flexs padding-bottom-sm flex-wrap padding-left-sm' : 'flexs padding-bottom-sm padding-left-sm'">
                            <view class="padding-bottom-sm text-sm text-orange padding-right-sm" v-if="item.distributionType != 1 && item.distributionType">支持到店自提</view>
                            <view class="markerpic" v-if="item.priceMaker" @tap.stop.prevent="getMarkerDetails">
                                <text class="text-orange">创客</text>
                                <text style="color: #ff1717">￥{{ item.priceMaker }}</text>
                            </view>
                        </view>
                    </view>
                </view>
                <view>
                    <view
                        class="goods_info radius margin-top-sm bg-white"
                        v-if="index % 2 == 1"
                        :data-goodsid="item.id"
                        :data-productSn="item.productSn"
                        @tap.stop.prevent="gotoNext"
                        v-for="(item, index) in randomGoodsList"
                        :key="index"
                    >
                        <view class="p-r">
                            <image class="goods_img" mode="widthFix" :src="item.pic" />
                            <view class="goods_sold padding-lr-sm text-sm text-white" v-if="item.sale">已售: {{ item.sale }}</view>
                        </view>

                        <view class="padding-lr-sm margin-tb-sm text-df text-tline">{{ item.name || '' }}</view>

                        <view class="flexs align-center padding-lr-sm padding-bottom">
                            <view class="text-price text-red text-df text-bold">{{ item.price }}</view>
                            <view v-if="item.originalPrice != null" class="padding-left-sm text-price text-darkGray text-sm text-through">{{ item.originalPrice }}</view>
                        </view>

                        <view :class="item.marker ? 'flexs padding-bottom-sm flex-wrap padding-left-sm' : 'flexs padding-bottom-sm padding-left-sm'">
                            <view class="padding-bottom-sm text-sm text-orange padding-right-sm" v-if="item.distributionType != 1 && item.distributionType">支持到店自提</view>
                            <view class="markerpic" v-if="item.priceMaker" @tap.stop.prevent="getMarkerDetails">
                                <text class="text-orange">创客</text>
                                <text style="color: #ff1717">￥{{ item.priceMaker }}</text>
                            </view>
                        </view>
                    </view>
                </view>
            </view>
        </view>
        <view class="goods_list"></view>
        <view class="bar_bottom bg-white flexs align-center justify-between">
            <view class="flexs align-center">
                <view class="text-center padding-l" @tap="getshow1">
                    <image :src="mallimgUrl + 'kf.png'" class="bar_icon"></image>
                    <view class="text-sm">客服</view>
                </view>
                <view class="text-center padding-l" @tap.stop.prevent="gotoShopCar" v-if="goodsDetail.productType == 1">
                    <image :src="mallimgUrl + 'shopcar.png'" class="bar_icon"></image>
                    <view class="text-sm">购物车</view>
                </view>
            </view>
            <view class="bar_btn radiues flexs align-center margin-lr-sm">
                <view class="flex-sub text-df text-white text-center bar_right" @tap.stop.prevent="getgoodsTypeShowFlag" data-type="1" v-if="goodsDetail.productType == 1">
                    加入购物车
                </view>
                <view class="flex-sub text-df text-white text-center" @tap.stop.prevent="getgoodsTypeShowFlag" data-type="2">立即购买</view>
            </view>
        </view>
        <!-- 评价 -->
        <!-- <view class="shop-plat">    
  <van-tabs active="{{ active }}" bind:change="changeActive" title-active-color="#333333" title-inactive-color="#999999"
    nav-class="nav-class" custom-class="custom-class">
    <van-tab title="商品详情" name="商品详情"></van-tab>
    <van-tab title="商品评价" name="商品评价" wx:if="{{false}}"></van-tab>
  </van-tabs>
</view>
<view wx:if="{{active === 1}}">
  <view class="goodsdetail-comment-select-wrap">
    <view class="goodsdetail-comment-btn {{commentActive == 0? 'active': ''}}" data-id="0" catchtap="switchComment">全部（999+）</view>
    <view class="goodsdetail-comment-btn {{commentActive == 1? 'active': ''}}" data-id="1" catchtap="switchComment">有图（10）</view>
    <view class="goodsdetail-comment-btn {{commentActive == 2? 'active': ''}}" data-id="2" catchtap="switchComment">好评（39）</view>
    <view class="goodsdetail-comment-btn {{commentActive == 3? 'active': ''}}" data-id="3" catchtap="switchComment">不太好（5）</view>
  </view>
  <view>
  <view wx:for="{{goodsCommentList}}" wx:for-item="item">
    <view class="goodsdetail-comment-client-container" >
      <image src="{{item.memberIcon}}" class="goodsdetail-comment-area-icon "></image>
      <view class="goodsdetail-comment-area-userinfo">
        <view class="goodsdetail-comment-name-text">{{item.nickName}}</view>
        <view class="goodsdetail-comment-decs-text">{{item.memberNickName}}</view>
        <view class="goodsdetail-comment-decs-text">{{item.createTime}}</view>
      </view>
      <view class="goodsdetail-comment-area-score-container">
        <image src="{{mallimgUrl + 'star.png'}}" class="goodsdetail-comment-score-icon"></image>
        <text>{{item.star}}</text>
      </view>
    </view>
    <view class="goodsdetail-comment-text">{{item.content}}</view>
    <van-grid column-num="3" border="{{ false }}">
      <van-grid-item use-slot wx:for="{{item.picList}}" wx:for-item="pic">
        <image
          class="shop-goods-icon"
          src="{{pic}}"
        />
      </van-grid-item>
    </van-grid>
    <van-field
      value=""
      clearable
      label="商家恢复："
      placeholder="感谢您的认可，期待下次光临！"
    />
  </view>
  </view>
</view> -->
        <!-- 客服弹窗 -->
        <view :class="'modal bottom-modal ' + (show1 ? 'show' : '')" @touchmove.stop.prevent="preventTouchMove">
            <view class="dialog dialog-goods" style="border-radius: 40rpx 40rpx 0 0" catchtap>
                <view class="bg-white padding-xl text-center">
                    <view class="padding-top-xs text-xl text-bold">联系客服</view>
                    <view class="padding-tb text-df text-darkGrey" style="border-bottom: 1px solid #cccccc">服务时间：9:00-22:00</view>
                    <view class="padding-tb text-df text-darkGrey" @tap.stop.prevent="callphone">0755-8465-9719</view>
                    <view class="show_box radiues text-white text-df bg-orange text-center" @tap="getshow1">取消</view>
                </view>
            </view>
        </view>
        <!-- 选择弹窗 -->
        <view :class="'modal bottom-modal ' + (goodsTypeShowFlag ? 'show' : '')" @touchmove.stop.prevent="preventTouchMove" @tap="closeGoodsType">
            <view class="dialog dialog-goods" catchtap>
                <view class="bg-white padding">
                    <view class="popuptitle flexs margin-bottom-sm" v-if="item.id == currentObj.id" v-for="(item, index) in skuList" :key="index">
                        <image
                            :data-itemone="item.pic ? item.pic : goodsDetail.pic"
                            @tap.stop.prevent="previewImg"
                            :src="item.pic ? item.pic : goodsDetail.pic"
                            mode="aspectFit"
                        ></image>

                        <view class="flexs flex-direction info_title padding-left-sm">
                            <view class="text-dg text-red margin-top-xs text-left">¥{{ item.price }}</view>
                            <view v-if="checkMaker && item.priceMaker" class="margin-top-xs text-left">
                                <text class="mkr">创客价: ¥{{ item.priceMaker }}</text>
                            </view>
                            <view class="text-sm text-gray padding-top text-left">库存：{{ item.stock }}件</view>
                            <view class="iconclose text-xl text-black" @tap="closeGoodsType">X</view>
                        </view>
                    </view>
                    <scroll-view class="scrolls" scroll-y>
                        <view class="flexs flex-direction padding-top">
                            <view class="text-dg text-left">规格</view>
                            <view class="flexs flex-wrap">
                                <view
                                    @tap="changskuid"
                                    :data-item="item"
                                    :class="
                                        'moudle radiues text-dm margin-top-sm margin-right-sm padding-tb-xs padding-lr-lg ' +
                                        (item.id == currentObj.id ? 'in text-white' : 'text-gray')
                                    "
                                    v-for="(item, index) in skuList"
                                    :key="index"
                                >
                                    <text v-for="(item, index1) in item.specification" :key="index1">{{ item.value }}</text>
                                </view>
                            </view>
                        </view>
                    </scroll-view>
                    <view class="flexs justify-between align-center padding-top-lg">
                        <view class="text-dg">数量</view>
                        <view class="flexs align-center text-car">
                            <view class="text-dg text-gray text-dd" @tap="sub">-</view>
                            <view class="amount flexs justify-center align-center">{{ num }}</view>
                            <view class="text-dg text-dd" @tap="add">+</view>
                        </view>
                    </view>
                    <view class="determine flexs justify-center align-center text-white bg-orange text-dg margin-top-lg" @tap.stop.prevent="confirmBtnClick">确认</view>
                    <view class="determines"></view>
                </view>
            </view>
        </view>
        <!-- 分享弹窗 -->
        <view :class="'modal bottom-modal ' + (showShare ? 'show' : '')">
            <view class="dialog dialog-goods" style="border-radius: 40rpx 40rpx 0 0">
                <view class="bg-white padding-xl text-center">
                    <button class="padding-top-xs text-xl" open-type="share" @tap="onShare">分享至微信好友/群</button>
                    <view style="border-bottom: 1px solid #cccccc50"></view>
                    <button class="padding-top-xs text-xl margin-bottom-sm" @tap="onPicture">生成分享海报</button>
                    <view class="show_box radiues text-white text-df bg-orange text-center" @tap="onShare">取消</view>
                </view>
            </view>
        </view>
        <!-- 分享内容 -->
        <view :class="'modal ' + (showShareConn ? 'show' : '')" style="overflow-y: hidden" @tap="onCanCelShare">
            <view class="dialog dialog-goods">
                <view class="radius-20">
                    <image :src="shareImg" mode="aspectFit" style="height: 540px" @longpress.capture="onSavePic"></image>
                </view>
                <view class="bg-share btn-share radiues text-white text-df text-center" @tap="onSavePic">保存图片</view>
                <view class="btn-share2 text-white text-df text-center flexs justify-center align-center" @tap.capture="getCode">
                    刷新
                    <image src="/static/images/icon_refresh.png" style="width: 20px; height: 20px"></image>
                </view>
            </view>
            <canvas
                width="480"
                height="860"
                style="width: 480px; height: 860px; position: absolute; left: 99999px"
                type="2d"
                class="canvas"
                canvas-id="shareCanvas"
                id="shareCanvas"
            ></canvas>
        </view>
        <!-- <van-action-sheet show="{{ goodsTypeShowFlag }}" title="选择" close-on-click-overlay="{{true}}" round="{{false}}" bind:close="closeGoodsType">
    <view class="goodsdetail-type-wrap">
      <view class="goodsdetail-type-desc">
        <image src="" class="goodsdetail-type-img"></image>
        <view class="goodsdetail-type-store-wrap">
          <view class="goodsdetail-type-money">¥ {{currentObj.price}}</view>
          <view class="goodsdetail-type-store">库存: {{currentObj.stock}}件</view>
        </view>
      </view>
      <view wx:for="{{typeList}}" wx:for-item="item">
        <view class="goodsdetial-type-type-title" >{{item.key}}</view>
        <view>
          <view class="goodsdetail-type-type-item {{pic.selected? 'active': ''}}" wx:for="{{item.value}}" wx:for-item="pic" data-type="{{item.key}}" data-key="{{pic.key}}" catchtap="handleSelectType">{{pic.key}}</view>
        </view>
      </view>
      <view class="goodsdetail-type-num-wrap">
        <text class="goodsdetail-type-num-text">数量</text>
        <view class="goodsdetail-type-add-num">
          <van-stepper  value="{{currentObj.quantity}}" step="1" bind:change="addBuyNum" data-id="{{currentObj.id}}"/>
        </view>
      </view>
      <view class="goodsdetail-type-confirm-btn" catchtap="confirmBtnClick">确认</view>
    </view>
  </van-action-sheet> -->
    </view>
</template>

<script>
const app = getApp();

const _request = require('../../utils/request.js');

let QQMapWX = require('../../utils/qqmap-wx-jssdk.min.js');

import { qqMapToBMap } from '../../utils/util.js';
let qqmapsdk = new QQMapWX({
    key: 'MBEBZ-6VQCP-EYSDK-LT7FQ-2LNUS-G4BTN'
});
export default {
    data() {
        return {
            mallimgUrl: app.globalData.mallimgUrl,

            //服务端图片前缀
            productsn: '',

            //商品sn
            currentgoodsid: '',

            goodsDetail: {
                productType: 0,
                shareTheBenefits: '',
                name: '',
                price: '',
                integration: '',
                originalPrice: '',
                priceMaker: '',
                sale: false,
                unit: '',
                distributionType: 0,
                availableIntegrationRemark: '',
                detailMobileHtml: '',
                pic: ''
            },

            //商品详情
            banners: [],

            //轮播
            current: 0,

            skuList: [],

            //规格数组
            currentObj: {
                id: ''
            },

            //选中的规格
            num: 1,

            //数量
            randomGoodsList: '',

            //猜你喜欢
            goodsTypeShowFlag: false,

            //规格弹窗
            addShopCarFlag: 0,

            //默认0 加入购物车1 购买2
            show1: false,

            //客服弹窗
            currentsharer: '',

            // 分享人id
            invitecode: '',

            checkMaker: false,

            //是否是创客用户
            stroeList: [],

            // 自提门店
            makerdetail: null,

            // isMaker: 0, //0商城商品, 1创客大礼包
            // active: 0,
            // goodsCommentList: [],//评价列表
            // commentActive: 0,
            // typeList: [],
            showShare: false,

            //分享弹窗
            showShareConn: false,

            shareImg: '',

            shareLogo: [
                'https://yiyuestore.oss-cn-shenzhen.aliyuncs.com/2022-08-24/692b09e641724874bc7eeb8fb5d4bf03-files', //finger
                'https://yiyuestore.oss-cn-shenzhen.aliyuncs.com/2022-08-24/9a5fc2dd0a85463cb173acc763b902aa-files', //logo
                'https://yiyuestore.oss-cn-shenzhen.aliyuncs.com/2022-08-24/a0bbc9866af74f66be1dc08ae0391da3-files' //title
            ],

            makerObj: '',
            makerDetail: {},
            address: '',
            storename: '',

            storeLocationDto: {
                cityName: '',
                districtName: '',
                location: ''
            },

            starttime: '',
            endtime: ''
        };
    },
    onLoad: function (options) {
        if (options.invitecode) {
            console.log(options.invitecode);
            uni.setStorageSync('code', options.invitecode);
        }

        console.log(options);
        this.setData({
            productsn: options.productsn,
            currentsharer: options.sharer,
            currentgoodsid: options.goodsid
        });
        this.getRandomProduct(); //猜你喜欢列表
        // this.handleBtn() //规格列表
        // this.loadcomment() //凭借列表
    },
    onShow() {
        this.setData({
            checkMaker: uni.getStorageSync('maker')?.ismaker || false
        });
        this.loadGoodsDetail(); //商品详情

        if (uni.getStorageSync('userid')) {
            // 获取邀请码
            _request
                .get('/recomUser/findReCode', {
                    userId: uni.getStorageSync('userid')
                })
                .then((res) => {
                    this.setData({
                        invitecode: res.data.data.invitecode
                    }); //生成海报

                    this.getCode();
                })
                .catch((error) => {
                    console.log(error, 'error');
                });

            _request
                .get('/maker/checkIsMaker', {
                    userId: uni.getStorageSync('userid')
                })
                .then((res) => {
                    this.setData({
                        makerObj: res.data.data
                    });
                    uni.setStorageSync('maker', res.data.data); // 是创客的时候才去获取详情

                    if (res.data.data && res.data.data.ismaker) {
                        // 获取用户创客信息
                        _request
                            .get('/maker/userMakerInfo', {
                                userId: uni.getStorageSync('userid')
                            })
                            .then((res) => {
                                let data = res.data.data;
                                let myupgrade = 0;

                                if (res.data.code == 200 && data) {
                                    // 计算当前升级所需人数
                                    data.makerUpRule.map((item, index) => {
                                        if (data.description == item.description && item.description != '传奇创客') {
                                            myupgrade = data.makerUpRule[index + 1].upgradeNum - data.downBuySum;
                                        } else if (data.description == '传奇创客') {
                                            myupgrade = 3000;
                                        }

                                        return item;
                                    });
                                    uni.setStorageSync('salesVolume', res.data.data.salesVolume);
                                    this.setData({
                                        makerDetail: { ...res.data.data, myupgrade }
                                    });
                                }
                            })
                            .catch((error) => {
                                console.log(error, 'error');
                            });
                    }
                })
                .catch((error) => {
                    console.log(error, 'error');
                });
        }
    },
    // 分享
    onShareAppMessage: function () {
        let userid = uni.getStorageSync('userId');
        return {
            title: this.goodsDetail.shareProductTitle || '我在意约分享了个商品！',
            // 默认是小程序的名称
            path: 'shopingmall/goodsdetail/goodsdetail?goodsid=' + this.currentgoodsid + '&sharer=' + userid + '&productsn=' + this.productsn + '&invitecode=' + this.invitecode,
            imageUrl: this.goodsDetail.pic
        };
    },
    methods: {
        // 查看详情创客卡
        getMarkerDetails() {
            uni.navigateTo({
                url: '/pages/maker/makerdetails/index?title=' + this.makerDetail.description
            });
        },

        //点击评论图片进行预览，长按保存分享图片
        previewImg(e) {
            console.log(e);
            uni.previewImage({
                current: e.currentTarget.dataset.itemone || e.currentTarget.dataset.item,
                // 当前显示图片的http链接
                urls: e.currentTarget.dataset.itemone ? [e.currentTarget.dataset.itemone] : this.banners // 需要预览的图片http链接列表
            });
        },

        // 查看更多自提门店
        toMore() {
            uni.navigateTo({
                url: '/shopingmall/stroemsg/stroemsg?productId=' + this.currentgoodsid + '&btnBool=' + false
            });
        },

        // 获取自提门店
        getStoreList(location) {
            //门店列表
            console.log(this);

            _request
                .get(
                    '/yy-stores/getPickUpStore',
                    {
                        productId: this.currentgoodsid,
                        longitude: location?.longitude || parseFloat(uni.getStorageSync('location')?.longitude || 0),
                        latitude: location?.latitude || parseFloat(uni.getStorageSync('location')?.latitude || 0)
                    },
                    app.globalData.mallType
                )
                .then((res) => {
                    if (res.data.code === 200) {
                        let list = res.data.data || [];
                        list.filter((item) => {
                            if (item.distance > 1000) {
                                item.distance = (item.distance / 1000).toFixed(1) + 'km';
                            } else {
                                item.distance = (item.distance || 0) + 'm';
                            }

                            return item;
                        });
                        this.setData({
                            stroeList: list
                        });
                    } else {
                        uni.showToast({
                            title: res.data.message,
                            icon: 'none'
                        });
                    }
                });
        },

        //检查权限
        checkPermission() {
            let vm = this;
            uni.getSetting({
                success(res) {
                    console.log('---->>', res);

                    if (res.authSetting['scope.userLocation'] != undefined && res.authSetting['scope.userLocation'] != true) {
                        uni.showModal({
                            title: '请求授权当前位置',
                            content: '需要获取您的地理位置，请确认授权',
                            success: function (res) {
                                if (res.cancel) {
                                    uni.showToast({
                                        title: '拒绝授权',
                                        icon: 'none',
                                        duration: 1000
                                    });
                                } else if (res.confirm) {
                                    uni.openSetting({
                                        success: (dataAu) => {
                                            if (dataAu.authSetting['scope.userLocation'] == true) {
                                                uni.showToast({
                                                    title: '授权成功',
                                                    icon: 'success',
                                                    duration: 1000
                                                }); //再次授权，调用wx.getLocation的API

                                                vm.getLocation();
                                            } else {
                                                uni.showToast({
                                                    title: '授权失败',
                                                    icon: 'none',
                                                    duration: 1000
                                                });
                                            }
                                        },
                                        fail: (e) => {
                                            vm.getLocation();
                                        }
                                    });
                                }
                            }
                        });
                    } else if (res.authSetting['scope.userLocation'] == undefined) {
                        // 不存在就获取权限
                        vm.getLocation();
                    } else {
                        //调用wx.getLocation的API
                        vm.getLocation();
                    }
                }
            });
        },

        // 授权定位权限
        getLocation() {
            let vm = this;
            let location;
            uni.getLocation({
                type: 'gcj02',
                success: function (res) {
                    location = res;
                    vm.getStoreList(location); // 经纬度转城市

                    qqmapsdk.reverseGeocoder({
                        //位置坐标
                        location: {
                            latitude: location.latitude,
                            longitude: location.longitude
                        },
                        //get_poi: 1, //是否返回周边POI列表：1.返回；0不返回(默认),非必须参数
                        success: function (res) {
                            //成功后的回调
                            var res = res.result;
                            uni.setStorageSync('mycity', res.ad_info.city);
                            vm.setData({
                                address: res.address
                            });
                        },
                        fail: function (error) {
                            console.error(error);
                        },
                        complete: function (res) {}
                    });
                },
                fail: function (error) {
                    if (error.errMsg == 'getLocation:fail:ERROR_NOCELL&WIFI_LOCATIONSWITCHOFF') {
                        uni.showToast({
                            title: '请打开GPS重新定位',
                            icon: 'none',
                            duration: 1000
                        });
                    }

                    console.log(error, 'error');
                }
            });
        },

        // 添加推荐
        goEquity() {
            uni.navigateTo({
                url: '/pages/maker/makerequities/index?id=' + '5'
            });
        },

        // 商品详情
        loadGoodsDetail: function () {
            _request
                .get(
                    '/mall-product/getDetails',
                    {
                        productSn: this.productsn
                    },
                    app.globalData.mallType
                )
                .then((res) => {
                    if (res.data.code === 200) {
                        res.data.data.mallSkuStockDtos.map((item) => {
                            item.specification = JSON.parse(item.specification);
                        });
                        let result = res.data.data.detailMobileHtml;
                        const regex = new RegExp('<img');
                        res.data.data.detailMobileHtml = result?.replace(/\<img/gi, '<img class="rich-img" ');
                        this.setData({
                            goodsDetail: res.data.data || {},
                            currentgoodsid: res.data.data.id || '',
                            banners: (res.data.data.albumPics || '').split(','),
                            // isMaker: res.data.data.productType || 0,
                            skuList: res.data.data.mallSkuStockDtos,
                            currentObj: res.data.data.mallSkuStockDtos[0]
                        });
                        console.log(this.skuList);

                        if (this.goodsDetail.productType == 2 || this.goodsDetail.productType == 6) {
                            // const msg = this.data.goodsDetail.productType == 2 ? '购买创大客礼包' : '购买199创客礼包'
                            // 大礼包商品提示
                            uni.showModal({
                                title: '提示',
                                content: '所有创客礼包类型商品下单并支付成功后，订单不支持取消、退款退货。如订单商品有质量问题请联系意约客服处理，请悉知;',
                                confirmText: '知道了',
                                //默认是“确定”
                                showCancel: false,

                                success(res) {
                                    if (res.confirm) {
                                    } else if (res.cancel) {
                                    }
                                }
                            });
                        } //定位

                        this.checkPermission();
                    }
                });
        },

        // 轮播
        currentHandle(e) {
            this.setData({
                current: e.detail.current
            });
        },

        //猜你喜欢列表
        getRandomProduct: function () {
            _request
                .get(
                    '/mall-product/getRandomProduct',
                    {
                        type: 1,
                        userId: uni.getStorageSync('userId')
                    },
                    app.globalData.mallType
                )
                .then((res) => {
                    if (res.data.code === 200 || res.data.data) {
                        this.setData({
                            randomGoodsList: res.data.data
                        });
                    }
                });
        },

        // 客服
        callphone() {
            uni.makePhoneCall({
                phoneNumber: '0755-8465-9719'
            });
        },

        // 规格弹窗
        getgoodsTypeShowFlag(e) {
            this.setData({
                goodsTypeShowFlag: true,
                addShopCarFlag: e.currentTarget.dataset.type
            });
        },

        //选择规格
        changskuid(e) {
            this.setData({
                num: 1,
                currentObj: e.currentTarget.dataset.item
            });
        },

        // 编辑数量
        add() {
            if (this.currentObj.stock == 0) {
                uni.showToast({
                    title: '库存不足',
                    icon: 'none'
                });
                return;
            } else if (this.num < this.currentObj.stock) {
                this.setData({
                    num: this.num + 1
                });
            } else {
                return;
            }
        },

        sub() {
            if (this.num == 1) {
                return;
            }

            this.setData({
                num: this.num - 1
            });
        },

        // 规格确认
        confirmBtnClick() {
            if (this.addShopCarFlag == 1) {
                if (this.skuList.length == 0) {
                    uni.showToast({
                        title: '该商品暂无库存,无法加入购物车！',
                        icon: 'none',
                        duration: 1500
                    });
                } else {
                    this.addShopCar();
                }
            } else {
                if (this.skuList.length == 0) {
                    uni.showToast({
                        title: '该商品暂无库存，请选购其他商品！',
                        icon: 'none',
                        duration: 1500
                    });
                } else {
                    this.buyNow();
                }
            }
        },

        // 加入购物车
        addShopCar() {
            let specification = JSON.stringify(this.currentObj.specification);

            _request
                .postObj(
                    '/mall-cart-item/save',
                    {
                        userId: uni.getStorageSync('userId'),
                        type: this.goodsDetail.type,
                        productSkuCode: this.currentObj.skuCode,
                        productCategoryId: this.goodsDetail.productCategoryId,
                        price: this.currentObj.price,
                        id: this.goodsDetail.id,
                        goodsType: this.goodsDetail.goodsType,
                        distributionType: 1,
                        productId: this.currentgoodsid,
                        quantity: this.num,
                        productSkuId: this.currentObj.id,
                        specification: specification
                    },
                    app.globalData.mallType
                )
                .then((res) => {
                    if (res.data.code === 200) {
                        this.setData({
                            goodsTypeShowFlag: false,
                            num: 1
                        });
                        uni.showToast({
                            title: '添加购物车成功',
                            icon: 'none'
                        });
                    } else {
                        uni.showToast({
                            title: res.data.message,
                            icon: 'none'
                        });
                    }
                });
        },

        // 立即购买
        buyNow() {
            console.log(this.goodsDetail);
            uni.redirectTo({
                url:
                    '/shopingmall/order/order?skuStockId=' +
                    this.currentObj.id +
                    '&quantity=' +
                    this.num +
                    '&tap=' +
                    '2' +
                    '&distributionType=' +
                    this.goodsDetail.distributionType +
                    '&goodsType=' +
                    this.goodsDetail.goodsType +
                    '&productCategoryId=' +
                    this.goodsDetail.productCategoryId +
                    '&productSkuCode=' +
                    this.currentObj.skuCode +
                    '&productId=' +
                    this.goodsDetail.id +
                    '&productType=' +
                    this.goodsDetail.productType +
                    '&specification=' +
                    JSON.stringify(this.currentObj.specification) +
                    '&sharer=' +
                    this.currentsharer
            }); // _request.get('/mall-cart-item/getBuyNow', {
            //   userId: wx.getStorageSync('userId'),
            //   skuStockId: this.data.currentgoodsid,
            //   quantity: this.data.num,
            //   addressId: this.data.currentObj.id
            // }, app.globalData.mallType).then((res) => {
            //   if (res.data.code === 200) {
            //     this.setData({
            //       goodsTypeShowFlag: false,
            //       num: 1
            //     })
            //   }
            // })
            // wx.redirectTo({
            //   url: '/shopingmall/order/order?cartId=' + res.data.data + '&sharer=' + this.data.currentsharer + '&isMaker=' + this.data.goodsDetail.isMaker + "&invitecode=" + this.data.invitecode
            // })
        },

        // 猜你喜欢跳转
        gotoNext: function (item) {
            uni.redirectTo({
                url: '/shopingmall/goodsdetail/goodsdetail' + this.getparams(item.currentTarget.dataset)
            });
        },

        getparams: function (item) {
            const list = [];

            for (const key in item) {
                if (key === 'url') {
                    continue;
                }

                list.push(key + '=' + item[key]);
            }

            if (list.length) {
                return '?' + list.join('&');
            } else {
                return '';
            }
        },

        // 规格列表
        // handleBtn() {
        //   const self = this
        //   _request.get('/commodity/getProductAttributeById', {
        //     id: this.data.currentgoodsid
        //   }, app.globalData.mallType).then((res) => {
        //     if (res.data.code === 200) {
        //       res.data.data.skuList.map(item => {
        //         item.sp1 = JSON.parse(item.sp1)
        //       })
        //       this.setData({
        //         skuList: res.data.data.skuList,
        //         currentObj: res.data.data.skuList[0],
        //       })
        //     }
        //   })
        // },
        // 跳转购物车
        gotoShopCar() {
            uni.navigateTo({
                url: '/shopingmall/shopcar/shopcar'
            });
        },

        // 关闭弹窗
        closeGoodsType() {
            this.setData({
                goodsTypeShowFlag: false
            });
        },

        // 客服弹窗
        getshow1() {
            this.setData({
                show1: !this.show1
            });
        },

        // 关闭弹窗
        onShare() {
            this.setData({
                showShare: !this.showShare
            });
        },

        //生成海报
        onPicture() {
            if (!this.shareImg) {
                uni.showToast({
                    title: '海报生成失败~',
                    icon: 'none'
                });
                this.setData({
                    showShare: !this.showShare
                });
                this.getCode();
                return;
            }

            this.setData({
                showShare: !this.showShare,
                showShareConn: !this.showShareConn
            });
        },

        //关闭弹窗
        onCanCelShare() {
            this.setData({
                showShareConn: !this.showShareConn
            });
        },

        //保存海报
        onSavePic() {
            let _this = this;

            uni.saveImageToPhotosAlbum({
                filePath: _this.shareImg,
                success: function (data) {
                    uni.hideLoading();
                    uni.showModal({
                        title: '提示',
                        content: '商品海报已存入手机相册，赶快分享给好友吧',
                        showCancel: false,

                        success(res) {
                            _this.setData({
                                showShareConn: false
                            });
                        }
                    });
                },
                fail: function (err) {
                    if (err.errMsg === 'saveImageToPhotosAlbum:fail:auth denied' || err.errMsg === 'saveImageToPhotosAlbum:fail auth deny') {
                        // 这边微信做过调整，必须要在按钮中触发，因此需要在弹框回调中进行调用
                        uni.showModal({
                            title: '提示',
                            content: '需要您授权保存相册',
                            showCancel: false,
                            success: (modalSuccess) => {
                                uni.openSetting({
                                    success(settingdata) {
                                        console.log('settingdata', settingdata);

                                        if (settingdata.authSetting['scope.writePhotosAlbum']) {
                                            uni.showModal({
                                                title: '提示',
                                                content: '获取权限成功,再次点击图片即可保存',
                                                showCancel: false
                                            });
                                        } else {
                                            uni.showModal({
                                                title: '提示',
                                                content: '获取权限失败，将无法保存到相册哦~',
                                                showCancel: false
                                            });
                                        }
                                    },

                                    fail(failData) {
                                        console.log('failData', failData);
                                    },

                                    complete(finishData) {
                                        console.log('finishData', finishData);
                                    }
                                });
                            }
                        });
                    }
                },

                complete(res) {
                    uni.hideLoading();
                }
            });
        },

        //获取二维码
        getCode() {
            const _this = this;

            let userid = uni.getStorageSync('userId') || '';
            const path =
                'shopingmall/goodsdetail/goodsdetail?goodsid=' + this.currentgoodsid + '&sharer=' + userid + '&productsn=' + this.productsn + '&invitecode=' + this.invitecode;

            _request
                .postObj(
                    '/mall-product/shareposter',
                    {
                        productInfoUrl: path,
                        type: 3
                    },
                    app.globalData.mallType
                )
                .then((res) => {
                    if (res.data.code === 200 && res.data.data) {
                        console.log('-----banners----', _this.banners[0]);

                        _this.drawPoster(_this.banners[0], res.data.data).then((res) => {
                            _this.setData({
                                shareImg: res
                            });
                        });
                    }
                });
        },

        //绘制海报
        // handleSelectType(event) {
        //   const key = event.currentTarget.dataset.key
        //   const type = event.currentTarget.dataset.type
        //   let typeList = this.data.typeList
        //   typeList.forEach(e => {
        //     if (e.key !== type) {
        //       return;
        //     }
        //     e.value.forEach(item => {
        //       item.selected = item.key === key
        //     })
        //   })
        //   let selectSku = []
        //   typeList.forEach(e => {
        //     e.value.forEach(item => {
        //       if (item.selected) {
        //         selectSku.push(item.key)
        //       }
        //     })
        //   })
        //   let currentObj = {}
        //   this.data.skuList.forEach(e => {
        //     const sp = JSON.parse(e.sp1)
        //     const flag = sp.every(item => {
        //       return selectSku.includes(item.value)
        //     })
        //     if (flag) {
        //       currentObj = e
        //     }
        //   })
        //   this.setData({
        //     typeList: typeList,
        //     currentObj: currentObj
        //   })
        // },
        // selectType(event) {
        //   const currentIndex = event.currentTarget.dataset.index
        //   let list = this.data.typeList
        //   let currentObj = {}
        //   list.forEach((e, index) => {
        //     if (index === currentIndex) {
        //       e.selected = true
        //       currentObj = e
        //     } else {
        //       e.selected = false
        //     }
        //   })
        //   this.setData({
        //     typeList: list,
        //     currentType: currentObj
        //   })
        // },
        // addButNum() {
        //   let buyNum = this.data.buyNum
        //   buyNum = buyNum + 1
        //   this.setData({
        //     buyNum: buyNum
        //   })
        // },
        // changeActive: function(index) {
        //   // console.log(index)
        //   this.setData({
        //     active: index.detail.index
        //   })
        //   this.loadcomment()
        // },
        // switchComment(event) {
        //   const id = event.currentTarget.dataset.id
        //   this.setData({
        //     commentActive: id
        //   })
        //   this.loadcomment()
        // },
        // loadcomment: function() {
        //   const self = this
        //   _request.get('/commodity/getMallCommentById', {
        //     id: this.data.currentgoodsid,
        //     status: this.data.commentActive
        //   }, app.globalData.mallType).then((res) => {
        //     console.log(res)
        //     if (res.data.code === 200) {
        //       let list = res.data.data.rows || []
        //       if (list.length) {
        //         list.forEach(ele => {
        //           if(ele.pics) {
        //             ele.picList = ele.pics.split(',')
        //           } else {
        //             ele.picList = []
        //           }
        //         })
        //       }
        //       self.setData({
        //         goodsCommentList: list
        //       })
        //     }
        //   })
        // },
        // addBuyNum() {
        //   if (this.data.currentObj.quantity < this.data.currentObj.stock) {
        //     this.data.currentObj.quantity = this.data.currentObj.quantity + 1
        //   }
        // }
        drawPoster(circleBg, qrCodeUrl) {
            const _this = this;

            let posterCanvas = uni.createSelectorQuery().select('#shareCanvas');
            return new Promise((resolve, reject) => {
                posterCanvas
                    .fields({
                        node: true,
                        size: true
                    })
                    .exec((res) => {
                        const canvas = res[0].node;
                        const ctx = canvas.getContext('2d');
                        const dpr = uni.getSystemInfoSync().windowWidth / 375;
                        canvas.width = res[0].width * dpr;
                        canvas.height = res[0].height * dpr;
                        console.log('--canvas--', dpr, canvas.width, canvas.height); //画背景

                        ctx.beginPath();
                        ctx.rect(0, 0, canvas.width, canvas.height);
                        ctx.fillStyle = '#F54C01';
                        ctx.fill();
                        ctx.beginPath();
                        var startX = 20;
                        var startY = 110;
                        ctx.rect(startX, startY, canvas.width - startX * 2, canvas.height - startY - 40);
                        ctx.fillStyle = '#FFF';
                        ctx.fill(); //绘制底部

                        var count = parseInt((canvas.width - startX * 2) / 30);

                        for (var i = 0; i < count; i++) {
                            ctx.beginPath();
                            ctx.arc(startX * 2 + 5 + i * 30, canvas.height - 40, 10, 0, 2 * Math.PI);
                            ctx.fillStyle = '#F54C01';
                            ctx.fill();
                            ctx.strokeStyle = '#F54C01';
                            ctx.stroke();
                        } //绘制logo

                        uni.getImageInfo({
                            src: _this.shareLogo[1],
                            success: (res) => {
                                let imageUrl = res.path; // 图片临时地址

                                let imageObj = canvas.createImage();
                                imageObj.src = imageUrl;

                                imageObj.onload = (res) => {
                                    ctx.beginPath();
                                    ctx.drawImage(imageObj, startX, startX, 80, 80);
                                }; //绘制logo2

                                uni.getImageInfo({
                                    src: _this.shareLogo[2],
                                    success: (res) => {
                                        let imageUrl = res.path; // 图片临时地址

                                        let imageObj = canvas.createImage();
                                        imageObj.src = imageUrl;

                                        imageObj.onload = (res) => {
                                            ctx.beginPath();
                                            ctx.drawImage(imageObj, startX + 80, startX + 20, 160, 46);
                                        };
                                    },
                                    fail: (err) => {
                                        reject(err);
                                    }
                                });
                            },
                            fail: (err) => {
                                reject(err);
                            }
                        }); //绘制圆角矩形

                        ctx.beginPath();
                        ctx.fillStyle = '#FFF';
                        var r = 35;
                        var w = 260;
                        var h = 70;
                        var rx = canvas.width - startX - w;
                        var ry = startX;
                        ctx.moveTo(rx + r, ry);
                        ctx.moveTo(rx + r, ry);
                        ctx.arcTo(rx + w, ry, rx + w, ry + h, r);
                        ctx.arcTo(rx + w, ry + h, rx, ry + h, r);
                        ctx.arcTo(rx, ry + h, rx, ry, r);
                        ctx.arcTo(rx, ry, rx + w, ry, r);
                        ctx.fillStyle = 'rgba(255,255,255,0.8)';
                        ctx.fill();
                        ctx.strokeStyle = '#F54C01';
                        ctx.stroke(); // 绘制海报

                        uni.getImageInfo({
                            src: circleBg,
                            success: (res) => {
                                let imageUrl = res.path; // 图片临时地址

                                let imageW = res.width / dpr;
                                let imageH = res.height / dpr;
                                let ratio = imageW / (canvas.width - startX * 2); // 获取比例
                                // console.log('--ratio--', ratio, imageW / canvas.width, imageH / canvas.height);

                                let imageObj = canvas.createImage();
                                imageObj.src = imageUrl;

                                imageObj.onload = (res) => {
                                    let y = canvas.width + startY;

                                    if (imageH / imageW > 1) {
                                        let ratioH = imageH / (canvas.width - startX * 2);
                                        ctx.drawImage(imageObj, startX + (canvas.width - startX * 2 - imageW / ratioH) / 2, startY, imageW / ratioH, imageH / ratioH);
                                    } else if (imageH / imageW == 1) {
                                        ctx.drawImage(imageObj, startX, startY, imageW / ratio, imageH / ratio);
                                    } else {
                                        ctx.drawImage(imageObj, startX, startY + (canvas.width - startX * 2 - imageH / ratio) / 2, imageW / ratio, imageH / ratio);
                                    } //绘制标题

                                    ctx.beginPath();
                                    ctx.font = '22px Arial'; //字体大小

                                    ctx.fillStyle = '#000'; //字体颜色
                                    // ctx.textAlign = "center"; //文字居中

                                    const x = startX + 20;
                                    console.log('--text--', x, y);

                                    if (_this.goodsDetail) {
                                        const { name, originalPrice, price } = _this.goodsDetail;

                                        if (name) {
                                            var textW = ctx.measureText(name).width;
                                            var last = 0;
                                            const lth = name.length;

                                            if (textW > canvas.width - startX * 4) {
                                                //第1行字
                                                for (var i = 0; i < lth; i++) {
                                                    textW = ctx.measureText(name.substring(0, lth - i)).width;

                                                    if (textW <= canvas.width - startX * 4) {
                                                        last = lth - i;
                                                        ctx.fillText(name.substring(0, lth - i), x, y);
                                                        break;
                                                    }
                                                } //第2行字

                                                textW = ctx.measureText(name.substring(last, lth)).width;

                                                if (textW >= canvas.width - startX * 4) {
                                                    for (var i = 0; i < lth - last; i++) {
                                                        textW = ctx.measureText(name.substring(last, lth - i)).width;

                                                        if (textW <= canvas.width - startX * 4) {
                                                            ctx.fillText(name.substring(last, lth - i - 2) + '......', x, y + 30);
                                                            break;
                                                        }
                                                    }
                                                } else {
                                                    ctx.fillText(name.substring(last, lth), x, y + 30);
                                                }
                                            } else {
                                                ctx.fillText(name, x, y);
                                            }
                                        } //绘制价格

                                        if (price) {
                                            ctx.font = '26px Arial'; //字体大小

                                            ctx.fillStyle = '#f00'; //字体颜色

                                            ctx.fillText('¥' + price, x, y + 88);
                                        }

                                        if (originalPrice) {
                                            ctx.font = '22px Arial'; //字体大小

                                            ctx.fillStyle = '#999'; //字体颜色

                                            var start = ctx.measureText(price).width;
                                            ctx.fillText('¥' + originalPrice, start + x + 40, y + 88); //中划线

                                            ctx.beginPath();
                                            const textWidth = ctx.measureText(originalPrice).width;
                                            ctx.rect(start + x + 40, y + 80, textWidth + 12, 2);
                                            ctx.fillStyle = '#666';
                                            ctx.fill();
                                            ctx.beginPath();
                                            ctx.moveTo(x, y + 120);
                                            ctx.lineTo(canvas.width - startX * 2, y + 120);
                                            ctx.lineWidth = 2;
                                            ctx.strokeStyle = '#E5E5E5';
                                            ctx.stroke();
                                        }
                                    } // 绘制二维码

                                    uni.getImageInfo({
                                        src: qrCodeUrl,
                                        success: (res) => {
                                            let qrImageUrl = res.path;
                                            let imageW = res.width;
                                            ratio = imageW / (180 * dpr);
                                            let qrImageObj = canvas.createImage();
                                            qrImageObj.src = qrImageUrl;

                                            qrImageObj.onload = (res) => {
                                                ctx.beginPath();
                                                ctx.drawImage(
                                                    qrImageObj,
                                                    20 / ratio,
                                                    20 / ratio,
                                                    imageW - 30 / ratio,
                                                    imageW - 30 / ratio,
                                                    x + 10,
                                                    y + 150,
                                                    180 / ratio,
                                                    180 / ratio
                                                ); // console.log('---', ratio, imageW, 20/ratio, imageW-30/ratio);

                                                ctx.beginPath();
                                                ctx.font = '28px Arial'; //字体大小

                                                ctx.fillStyle = '#000'; //字体颜色

                                                var wh = ctx.measureText('长按识别抢购').width;
                                                ctx.fillText('长按识别抢购', (canvas.width - wh) / 2, y + 150 + 180 / ratio / 2 + 14); //绘制手指

                                                uni.getImageInfo({
                                                    src: _this.shareLogo[0],
                                                    success: (res) => {
                                                        let imageUrl = res.path; // 图片临时地址

                                                        let imageObj = canvas.createImage();
                                                        imageObj.src = imageUrl;

                                                        imageObj.onload = (res) => {
                                                            ctx.beginPath();
                                                            ctx.drawImage(imageObj, canvas.width - 50 - 180 / ratio, y + 150, 180 / ratio, 180 / ratio);
                                                        };
                                                    },
                                                    fail: (err) => {
                                                        reject(err);
                                                    }
                                                }); //画图像

                                                let info = uni.getStorageSync('userInfo');
                                                let headImg = info?.imgPath || '';
                                                let nickName = info?.storeName || '';

                                                if (!info) {
                                                    info = uni.getStorageSync('user');
                                                    headImg = info?.headImg || '';
                                                    nickName = info?.nickname || '';
                                                }

                                                if (info) {
                                                    // console.log('---info--', info, headImg, nickName);
                                                    if (headImg) {
                                                        uni.getImageInfo({
                                                            src: headImg,
                                                            success: (res) => {
                                                                let imageUrl = res.path; // 图片临时地址

                                                                let imageObj = canvas.createImage();
                                                                imageObj.src = imageUrl;

                                                                imageObj.onload = (res) => {
                                                                    ctx.beginPath();

                                                                    if (nickName) {
                                                                        ctx.font = '20px Arial'; //字体大小

                                                                        ctx.fillStyle = '#000'; //字体颜色

                                                                        var textW = ctx.measureText(nickName).width;
                                                                        const lth = nickName.length;

                                                                        if (textW > 150) {
                                                                            //第1行字
                                                                            for (var i = 0; i < lth; i++) {
                                                                                textW = ctx.measureText(nickName.substring(0, lth - i)).width;

                                                                                if (textW <= 150) {
                                                                                    ctx.fillText(nickName.substring(0, lth - i - 2) + '......', rx + r * 2 + 10, 50);
                                                                                    break;
                                                                                }
                                                                            }
                                                                        } else {
                                                                            ctx.fillText(nickName, rx + r * 2 + 10, 50);
                                                                        }
                                                                    }

                                                                    ctx.font = '16px Arial'; //字体大小

                                                                    ctx.fillStyle = '#666'; //字体颜色

                                                                    ctx.fillText('推荐一个好礼物给你~', rx + r * 2 + 10, 75);
                                                                    ctx.arc(rx + 35, ry + 35, r - 4, 0, 2 * Math.PI);
                                                                    ctx.clip();
                                                                    ctx.drawImage(imageObj, rx + 2, ry + 2, 70, 70); // canvas转图片临时路径

                                                                    uni.canvasToTempFilePath({
                                                                        canvas: canvas,
                                                                        fileType: 'jpg',
                                                                        quality: 1,
                                                                        success: (res) => {
                                                                            resolve(res.tempFilePath);
                                                                        },
                                                                        fail: (err) => {
                                                                            reject(err);
                                                                        }
                                                                    });
                                                                };
                                                            },
                                                            fail: (err) => {
                                                                reject(err);
                                                            }
                                                        });
                                                    } else {
                                                        ctx.beginPath();

                                                        if (nickName) {
                                                            ctx.font = '20px Arial'; //字体大小

                                                            ctx.fillStyle = '#000'; //字体颜色

                                                            var textW = ctx.measureText(nickName).width;
                                                            const lth = nickName.length;

                                                            if (textW > 150) {
                                                                //第1行字
                                                                for (var i = 0; i < lth; i++) {
                                                                    textW = ctx.measureText(nickName.substring(0, lth - i)).width;

                                                                    if (textW <= 150) {
                                                                        ctx.fillText(nickName.substring(0, lth - i - 2) + '......', rx + r * 2 + 10, 50);
                                                                        break;
                                                                    }
                                                                }
                                                            } else {
                                                                ctx.fillText(nickName, rx + r * 2 + 10, 50);
                                                            }
                                                        }

                                                        ctx.font = '16px Arial'; //字体大小

                                                        ctx.fillStyle = '#666'; //字体颜色

                                                        ctx.fillText('推荐一个好礼物给你~', rx + r * 2 + 10, 75); // canvas转图片临时路径

                                                        uni.canvasToTempFilePath({
                                                            canvas: canvas,
                                                            fileType: 'jpg',
                                                            quality: 1,
                                                            success: (res) => {
                                                                resolve(res.tempFilePath);
                                                            },
                                                            fail: (err) => {
                                                                reject(err);
                                                            }
                                                        });
                                                    }
                                                }
                                            };
                                        },
                                        fail: (err) => {
                                            reject(err);
                                        }
                                    });
                                };
                            },
                            fail: (err) => {
                                reject(err);
                            }
                        });
                    });
            });
        },

        preventTouchMove() {
            console.log('占位：函数 preventTouchMove 未声明');
        }
    }
};
</script>
<style>
page {
    background: #fbfbfb;
}

.banner_box {
    width: 710rpx;
    height: 710rpx;
    position: relative;
}

.markerpic {
    height: 34rpx;
    background: #fff6ef;
    border: 1rpx solid #ff8722;
    border-radius: 4rpx;
    justify-content: center;
    display: flex;
    align-items: center;
    font-size: 22rpx;
    margin-left: 20rpx;
    padding: 0 10rpx;
}

.swiper_box {
    width: 710rpx;
    height: 710rpx;
}

.banner_pageno {
    position: absolute;
    right: -20rpx;
    bottom: 20rpx;
    background-color: #f4f4f4;
    line-height: 40rpx;
    color: #999999;
}

.tips_share {
    width: 710rpx;
    line-height: 40rpx;
    background-color: rgba(255, 135, 34, 0.1);
}

.goods_share {
    width: 48rpx;
    height: 48rpx;
}

.pic_img {
    width: 670rpx;
}

.goods_list {
    padding-bottom: calc(120rpx + env(safe-area-inset-bottom) / 2);
}

.border_line {
    width: 100rpx;
    height: 2rpx;
}

.bar_bottom {
    height: calc(100rpx + env(safe-area-inset-bottom) / 2);
    padding-bottom: calc(env(safe-area-inset-bottom) / 2);
    width: 750rpx;
    position: fixed;
    bottom: 0;
    z-index: 99;
}

.bar_icon {
    width: 50rpx;
    height: 50rpx;
}

.bar_btn {
    background: linear-gradient(270deg, #ff8722 0%, #ffbc47 100%);
    width: 400rpx;
    line-height: 68rpx;
}

.bar_right {
    border-right: 1px solid #ffffff;
}

.show_box {
    width: 650rpx;
    line-height: 90rpx;
}

/* 加入购物车弹窗 */
.popuptitle {
    height: 136rpx;
}

.popuptitle image {
    width: 136rpx;
    height: 136rpx;
}

.info_title {
    width: 470rpx;
    height: 136rpx;
    position: relative;
}

.iconclose {
    position: absolute;
    right: -60rpx;
    top: -10rpx;
}

.scrolls {
    max-height: 500rpx;
}

::-webkit-scrollbar {
    width: 0;
    height: 0;
    color: transparent;
}

.moudle {
    border: 1px solid #666666;
    background: #ffffff;
}

.in {
    border: 1px solid #ff8722;
    background: #ff8722;
}

.text-car {
    height: 38rpx;
    border: 2rpx solid #aaa;
    border-radius: 10rpx;
}

.amount {
    height: 38rpx;
    border-left: 2rpx solid #aaa;
    border-right: 2rpx solid #aaa;
    padding-left: 10rpx;
    padding-right: 10rpx;
}

.determine {
    width: 100%;
    height: 76rpx;
    border-radius: 50rpx;
}

.determines {
    height: calc(2rpx + env(safe-area-inset-bottom) / 2);
}

button::after {
    border: none;
}

button {
    background-color: #fff;
    padding: 0;
    margin: 0;
}

.text-dd {
    font-size: 45rpx;
    padding-left: 10rpx;
    padding-right: 10rpx;
}

/* 列表样式 */
.goods_info {
    width: 340rpx;
    position: relative;
    box-shadow: 2px 4px 8px 0px #f5f5f5;
}

.goods_img {
    width: 340rpx;
    height: 340rpx;
}

.goods_sold {
    position: absolute;
    left: 0;
    bottom: 10rpx;
    line-height: 46rpx;
    border-radius: 0 20rpx 20rpx 0;
    background-color: rgb(0, 0, 0, 0.5);
}

.goodsdetail-container {
    padding: 10rpx;
    overflow-x: hidden;
}

.goodsdetail-banner-container {
    position: relative;
}

.shopping-banner-item {
    width: 100%;
    height: 100%;
}

.goodsdetail-banner-pageno {
    position: absolute;
    right: 15rpx;
    bottom: 65rpx;
    background-color: #f4f4f4;
    width: 100rpx;
    height: 40rpx;
    border-radius: 40rpx;
    line-height: 40rpx;
    color: #999999;
    text-align: center;
}

.goodsdetail-share-container {
    background-color: #fbefe4;
    text-align: center;
    font-size: 25rpx;
    color: #ff8722;
    padding: 3rpx 0;
}

.goodsdetail-flex-container {
    display: flex;
    flex-direction: row;
}

.goodsdetail-flex-20 {
    flex: 20;
}

.goodsdetail-flex-9 {
    flex: 9;
}

.goodsdetail-share-btn {
    width: 50rpx;
    height: 50rpx;
}

.goodsdetail-text-bold {
    font-weight: 700;
}

.goodsdetail-share-text {
    font-size: 30rpx;
}

.goodsdetail-goods-name-text {
    font-size: 40rpx;
}

.goodsdetail-price-text {
    color: #ff1717;
    font-size: 40rpx;
}

.goodsdetail-ori-price-text {
    color: #666666;
    font-size: 30rpx;
    text-decoration: line-through;
    margin-left: 50rpx;
}

.goodsdetail-price-container {
    position: relative;
}

.goodsdetail-price-sale-num-text {
    color: #666666;
    font-size: 30rpx;
    position: absolute;
    right: 0rpx;
    bottom: 5rpx;
    display: block;
}

.goodsdetail-mt-20 {
    margin-top: 20rpx;
}

.goodsdetail-desc-title-text {
    font-size: 40rpx;
    color: #666666;
}

.goodsdetail-desc-text {
    font-size: 38rpx;
    color: #999999;
}

.goodsdetail-descri-title-text {
    font-size: 40rpx;
}

.goodsdetail-descri-item-title-text {
    font-size: 35rpx;
    color: #666666;
    display: list-item;
    list-style: desc;
}

.goodsdetail-descri-item-content-text {
    font-size: 30rpx;
    color: #b5b5b5;
}

.goodsdetail-circle-point {
    width: 2rpx;
    height: 2rpx;
    background-color: #666666;
    border-radius: 50%;
    display: inline-block;
    position: relative;
    top: 0rpx;
    left: 0rpx;
}

.goodsdetail-guess-title-text {
    width: 400rpx;
    margin: 0 auto;
    text-align: center;
}

.goodsdetail-guess-line {
    height: 1rpx;
    width: 100rpx;
    background-color: #ff8722;
    margin-top: 26rpx;
}

.goodsdetail-guess-text {
    font-size: 40rpx;
    padding: 0 20rpx;
}

.shop-goods-icon {
    width: 300rpx;
    height: 250rpx;
}

.shopping-tool-bar-text {
    font-size: 35rpx;
}

.shopping-goods-text {
    font-size: 30rpx;
}

.shopping-goods-price {
    color: #ff1717;
    font-weight: 700;
    font-size: 32rpx;
}

.shopping-goods-ori-price {
    color: #666666;
    font-size: 30rpx;
    margin-left: 10rpx;
    text-decoration: line-through;
}

.shopping-goods-sale {
    color: #666666;
    font-size: 30rpx;
    margin-left: 10rpx;
}

.goodsdetail-recommend-container {
    height: 800rpx;
    overflow-y: auto;
}

.goodsdetail-bottom-bar-item {
    width: 25%;
}

.goodsdetail-bottom-icon {
    width: 50rpx;
    height: 50rpx;
    margin-left: 10rpx;
}

.goodsdetail-bottom-icon-text {
    font-size: 35rpx;
}

.goodsdetail-bottom-item {
    float: left;
}

.goodsdetail-bottom-item + .goodsdetail-bottom-item {
    margin-left: 100rpx;
}

.goodsdetail-bottom-item-1 {
    width: 350rpx;
}

.goodsdetail-bottom-container {
    position: relative;
}

.goodsdetail-bottom-item-1 {
    width: 400rpx;
    position: absolute;
    right: 0;
    top: 0;
    font-size: 35rpx;
    height: 90rpx;
    border-radius: 90rpx;
    line-height: 90rpx;
    text-align: center;
    background-color: #ffbc47;
    color: #fff;
    margin-top: 5rpx;
}

.goods-detail-bottom-btn {
    padding: 20rpx;
}

.goods-detail-bottom-btn-line {
    border-left: 1rpx solid #fff;
}

.goodsdetail-goods-detail {
    width: 100%;
}

.goodsdetail-comment-select-wrap {
    height: 40rpx;
}

.goodsdetail-comment-btn {
    width: 22%;
    box-sizing: border-box;
    margin: 5rpx;
    border: 1rpx solid #999999;
    color: #999999;
    height: 40rpx;
    line-height: 40rpx;
    text-align: center;
    float: left;
    border-radius: 40rpx;
    font-size: 25rpx;
}

.goodsdetail-comment-btn.active {
    color: #ff8722;
    background-color: #ffc492;
    border: 1rpx solid #ffc492;
}

.goodsdetail-comment-area-icon {
    width: 100rpx;
    height: 100rpx;
    float: left;
}

.goodsdetail-comment-client-container {
    height: 100rpx;
    padding: 40rpx 10rpx;
    position: relative;
}

.goodsdetail-comment-area-userinfo {
    float: left;
    margin-left: 10rpx;
}

.goodsdetail-comment-area-score-container {
    position: absolute;
    top: 40rpx;
    right: 50rpx;
}

.goodsdetail-comment-score-icon {
    width: 40rpx;
    height: 40rpx;
}

.goodsdetail-comment-name-text {
    font-size: 35rpx;
    font-weight: 700;
}

.goodsdetail-comment-decs-text {
    font-size: 30rpx;
    color: #666666;
}

.goodsdetail-comment-text {
    color: #666666;
    font-size: 30rpx;
    padding: 0 20rpx;
}

.goodsdetail-select-container {
    margin-top: 40rpx;
    padding: 20rpx;
}

.goodsdetail-select-img {
    width: 150rpx;
    height: 150rpx;
    float: left;
}

.goodsdetail-select-price-wrap {
    margin-left: 20rpx;
    float: left;
}

.goodsdetail-select-price-text {
    color: #ff1717;
    font-size: 40rpx;
    font-weight: 700;
}

.goodsdetail-select-price-text .sign {
    font-size: 35rpx;
}

.goodsdetail-select-store {
    font-size: 35rpx;
    color: #999999;
}

.goodsdetail-select-info {
    clear: both;
    height: 200rpx;
}

.goodsdetail-color-text {
    font-weight: 700;
    font-size: 40rpx;
}

.goodsdetail-type-container {
    height: 200rpx;
    overflow: auto;
}

.goodsdetail-type-text {
    height: 40rpx;
    color: #999999;
    font-size: 30rpx;
    width: 20%;
    margin-left: 30rpx;
    line-height: 40rpx;
    text-align: center;
    border-radius: 40rpx;
    float: left;
    border: 1rpx solid #999999;
    margin-top: 20rpx;
}

.goodsdetail-type-text.active {
    color: #fff;
    background-color: #ff8722;
    border: 1rpx solid #ff8722;
}

.goodsdetail-num-container {
    height: 100rpx;
    position: relative;
}

.goodsdetail-num-input {
    position: absolute;
    right: 0rpx;
    top: 0rpx;
}

.goodsdetail-confirm-btn {
    background-color: #ff8722;
    color: #fff;
    width: 90%;
    margin: 20rpx auto;
    height: 80rpx;
    line-height: 80rpx;
    font-size: 50rpx;
    border-radius: 50rpx;
    text-align: center;
}

.goodsdetail-type-wrap {
    height: 850rpx;
    padding: 20rpx;
}

.goodsdetail-type-desc {
    height: 200rpx;
}

.goodsdetail-type-img,
.goodsdetail-type-store {
    width: 200rpx;
    height: 200rpx;
    float: left;
}

.goodsdetail-type-img {
    background-color: #ececec;
}

.goodsdetail-type-store-wrap {
    width: 400rpx;
    margin-left: 20rpx;
}

.goodsdetail-type-money {
    font-size: 40rpx;
    color: #ff1717;
    font-weight: 700;
}

.goodsdetail-type-store {
    margin-top: 20rpx;
    font-size: 30rpx;
    color: #999999;
}

.goodsdetial-type-type-title {
    clear: both;
    font-size: 40rpx;
    font-weight: 700;
    margin-bottom: 30rpx;
}

.goodsdetail-type-type-item {
    font-size: 40rpx;
    color: #999999;
    border: 1rpx solid #999999;
    height: 50rpx;
    line-height: 50rpx;
    width: 20%;
    text-align: center;
    border-radius: 50rpx;
    float: left;
    margin-left: 20rpx;
    margin-bottom: 10rpx;
}

.goodsdetail-type-type-item.active {
    color: #fff;
    background-color: #ff8722;
    border: 1rpx solid #ff8722;
}

.goodsdetail-type-num-wrap {
    clear: both;
    height: 80rpx;
}

.goodsdetail-type-add-num {
    float: right;
}

.goodsdetail-type-num-text {
    font-size: 40rpx;
    font-weight: 700;
}

.goodsdetail-type-confirm-btn {
    width: 90%;
    margin: 10rpx auto;
    height: 70rpx;
    line-height: 70rpx;
    font-size: 50rpx;
    font-weight: 500;
    letter-spacing: 10rpx;
    text-align: center;
    background-color: #ff8722;
    color: #fff;
    padding: 10rpx 0;
    border-radius: 70rpx;
}

.rich-img {
    width: 670rpx;
}

.wscnph {
    width: 670rpx;
}

.padding-l {
    padding-left: 30rpx;
}

.mkr {
    border: 1px solid #ff8722;
    background: #fff6ef;
    border-radius: 4rpx;
    color: #ff8722;
    padding: 0 8rpx;
    font-size: 22rpx;
}

.pick-store {
    width: 710rpx;
    background: #ffffff;
    box-shadow: 1px 1px 4px 0px rgba(236, 236, 236, 0.4);
    border-radius: 6px;
    padding: 10rpx 20rpx;
    box-sizing: border-box;
    margin: 20rpx;
    position: relative;
}

.pick-store view {
    margin-top: 10rpx;
    font-size: 28rpx;
    font-family: PingFangSC-Regular, PingFang SC;
    font-weight: 400;
    color: #666666;
    line-height: 40rpx;
}

.pick-store view:nth-child(2) {
    max-width: 520rpx;
}

.more {
    position: absolute;
    right: 10rpx;
    top: 10rpx;
}

.more view {
    line-height: 14px;
}
</style>
